const generateSpacing = num => {
  return new Array(num + 1)
    .fill(1)
    .reduce((cur, next, index) => ({...cur, [index]: `${index}px`, [-index]: `${-index}px`}), {})
}
// const generateSpacing = (num) => {
//   return new Array(num + 1).fill(1).reduce(
//     (cur,next,index) => ({...cur,[index]: `calc(${index} * var(--rootFontSize) / 16)`,[-index]: `calc(${index} * var(--rootFontSize) / 16)`}),
//     {}
//   );
// };

const range = size =>
  new Array(size)
    .fill(1)
    .reduce((cur, next, index) => ({...cur, [`${index}/${size}`]: `${(index / size) * 100}%`}), {})

const rotate = size =>
  new Array(size).fill(1).reduce((cur, next, index) => ({...cur, [`${index}`]: `${index}deg`}), {})

const defaultTailwindConfig = {
  spacing: {
    px: '1px',
    ...generateSpacing(1920)
  },

  boxShadow: {
    sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
    DEFAULT: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
    md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
    lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
    xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
    '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
    '3xl': '0 35px 60px -15px rgba(0, 0, 0, 0.3)',
    inner: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)',
    none: 'none',
    card: '0px 6px 10px 0px rgba(233,236,238,0.6)',
    cardActived: '0px 6px 10px 0px rgba(23,88,240,0.6)'
  },
  fontSize: {
    xs: '.75rem',
    sm: '.875rem',
    base: '1rem',
    lg: '1.125rem',
    xl: '1.25rem',
    '2xl': '1.5rem',
    '3xl': '1.875rem',
    '4xl': '2.25rem',
    '5xl': '3rem',
    '6xl': '3.rem',
    '7xl': '5rem',
    '8xl': '6rem',
    '9xl': '7rem'
  },
  width: {
    auto: 'auto',
    full: '100%',
    screen: '100vw',
    min: 'min-content',
    max: 'max-content',
    fit: 'fit-content'
  },
  proportation: {
    '1/2': '50%',
    '1/3': '33.333333%',
    '2/3': '66.666667%',
    '1/4': '25%',
    '2/4': '50%',
    '3/4': '75%',
    '1/5': '20%',
    '2/5': '40%',
    '3/5': '60%',
    '4/5': '80%',
    '1/6': '16.666667%',
    '2/6': '33.333333%',
    '3/6': '50%',
    '4/6': '66.666667%',
    '5/6': '83.333333%',
    '1/12': '8.333333%',
    '2/12': '16.666667%',
    '3/12': '25%',
    '4/12': '33.333333%',
    '5/12': '41.666667%',
    '6/12': '50%',
    '7/12': '58.333333%',
    '8/12': '66.666667%',
    '9/12': '75%',
    '10/12': '83.333333%',
    '11/12': '91.666667%',
    ...range(100)
  },
  rotate: {
    ...rotate(361)
  },
  fontFamily: {
    kmedium: ['kaigengo-medium'],
    kbold: ['kaigengo-bold'],
    kregular: ['kaigengo-regular'],
    visualScreenTitle: ['visualScreen-title']
  },
  letterSpacing: {
    tightest: '-.075em',
    tighter: '-.05em',
    tight: '-.025em',
    normal: '0',
    wide: '.025em',
    wider: '.05em',
    widest: '.1em'
  },
  backgroundImage: {
    // loginPc: 'url(https://d.lohand.com:1112/images/ConstantBlueCloud/WEB/login-pc.png)',
    loginPc: 'url(https://d.lohand.com:1112/images/ConstantBlueCloud/WEB/login_bg1.png)',
    loginH5: 'url(https://d.lohand.com:1112/images/ConstantBlueCloud/WEB/login-h5.png)'
  }
}
module.exports = defaultTailwindConfig
